var banner=document.getElementsByClassName('banner');
var list=document.getElementsByClassName('list');
var dotlist=document.getElementsByClassName('dotlist');
var turn_left=document.getElementById('turn_left');
var turn_right=document.getElementById('turn_right');


var n=0;
function circle (){
	for (var i = 0; i < list.length; i++) {
		list[i].style.display='none';
		dotlist[i].style.background='#8B8B8B';
		}

		list[n].style.display='block';
		dotlist[n].style.background='#fff';
	
	if (n==list.length-1) {
		n=0;
	}else{
		n=n+1;
	}
}
	time = setInterval(circle, 1000);
	banner[0].onmouseover =function (){
		clearInterval(time);
	}
	banner[0].onmouseout =function (){
		time=setInterval(circle,1000);
	}
	for (var k=0; k <dotlist.length; k++) {
		dotcircle(k);
	};
	function dotcircle(k){
		dotlist[k].onclick=function(){
			n=k;
			circle();
		}
	}
	turn_left.onclick =function (){
		if (n==0) {n=dotlist.length-1}
		else if (n==1) {
			n=dotlist.length-2}
			else{
				n=n-2
			}		
		circle()
	}

	turn_right.onclick=function (){
		circle()
	}